import { callbackProviderWithArgs } from "../../../__util__/async-helpers";

static var users = {
    "0": {
        name: "John B. Flowers",
        occupation: "Clock repairer",
        gender: "Male"
    },
    "1": {
        name: "Pamela R. Rice",
        occupation: "Cartographer",
        gender: "Female"
    },
    "2": {
        name: "Barbara C. Rigsby",
        occupation: "Enrollment specialist",
        gender: "Female"
    },
    "3": {
        name: "Anthony J. Ward",
        occupation: "Clinical laboratory technologist",
        gender: "Male"
    }
};
static var userInfo = callbackProviderWithArgs(1, arg => users[arg.userId]);

<ul>
    <for|userId| of=[0, 1, 2, 3]>
        <li>
            <await(
                userInfo.bind(null, {
                    userId: userId
                })
            ) name=("user" + userId)>
                <@then|userInfo|>
                    <ul>
                        <li>
                            <b>Name:</b> ${userInfo.name}
                        </li>
                        <li>
                            <b>Gender:</b> ${userInfo.gender}
                        </li>
                        <li>
                            <b>Occupation:</b> ${userInfo.occupation}
                        </li>
                    </ul>
                </@then>
            </await>
        </li>
    </for>
</ul>